// 🎨 侧边栏样式优化
// 增加菜单栏和主内容区域的对比度

// ======================== 侧边栏背景色 ========================

// 亮色主题
.global-sider {
  background: #ffffff !important;
  border-right: 1px solid #e8e8e8 !important;
  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);
  
  // Logo 区域
  .sider-logo {
    background: #ffffff;
    border-bottom: 1px solid #e8e8e8;
  }
  
  // 主侧边栏（垂直混合布局）
  .main-sider {
    background: #ffffff !important;
    border-right: 1px solid #e8e8e8 !important;
  }
  
  // 子侧边栏（混合布局）
  .sub-sider {
    background: #fafafa !important;
    
    &.vertical-mix-sub,
    &.horizontal-mix-sub {
      background: #fafafa !important;
      border-right: 1px solid #e8e8e8 !important;
    }
  }
  
  // 菜单容器
  .sider-menu-wrapper,
  .main-sider-menu {
    background: transparent;
  }
}

// 暗色主题
html.dark {
  .global-sider {
    background: #1a1a1a !important;
    border-right: 1px solid #2a2a2a !important;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.2);
    
    // Logo 区域
    .sider-logo {
      background: #1a1a1a;
      border-bottom: 1px solid #2a2a2a;
    }
    
    // 主侧边栏（垂直混合布局）
    .main-sider {
      background: #1a1a1a !important;
      border-right: 1px solid #2a2a2a !important;
    }
    
    // 子侧边栏（混合布局）
    .sub-sider {
      background: #141414 !important;
      
      &.vertical-mix-sub,
      &.horizontal-mix-sub {
        background: #141414 !important;
        border-right: 1px solid #2a2a2a !important;
      }
    }
  }
}

// ======================== 侧边栏过渡动画 ========================
.global-sider {
  transition: background-color 0.3s ease, 
              border-color 0.3s ease, 
              box-shadow 0.3s ease;
  
  .main-sider,
  .sub-sider,
  .sider-logo {
    transition: background-color 0.3s ease, 
                border-color 0.3s ease;
  }
}

// ======================== 修复内联样式覆盖 ========================
// 由于 global-sider/index.vue 中使用了内联样式
// 我们需要提高优先级

#sub-sider-menu-container,
#sider-menu-container-sub {
  html:not(.dark) & {
    background: #fafafa !important;
  }
  
  html.dark & {
    background: #141414 !important;
  }
}

